<template>
  <view>
    <button class="avatar-wrapper" open-type="chooseAvatar" @chooseavatar="onChooseAvatar">
      <image class="avatar" :src="avatarUrl"></image>
    </button>
    <input type="nickname" class="weui-input" placeholder="请输入昵称"/>
  </view>
</template>

<script>
export default {
  data () {
    return {
      avatarUrl: 'https://mmbiz.qpic.cn/mmbiz/icTdbqWNOwNRna42FI242Lcia07jQodd2FJGIYQfG0LAJGFxM4FbnQP6yfMxBgJ0F3YRqJCJ1aPAK2dQagdusBZg/0'
    }
  },
  methods: {
    onChooseAvatar (e) {
      console.log(e)
      this.avatarUrl = e.detail.avatarUrl
    }
  }
}
</script>

<style scoped>

</style>